<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>  
  <meta charset="utf-8">
  <title>Olympia: eCommerce Template</title>
  <meta name="description" content="">
  <meta name="author" content="Speed730">
  <!-- Mobile Specific Metas
  ================================================== -->
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <!-- CSS
  ================================================== -->
  <link rel="stylesheet" href="css/reset.css" media="screen">
  <link rel="stylesheet" href="css/text.css" media="screen">  
  <link href='http://fonts.googleapis.com/css?family=Questrial|PT+Sans:400,700|Muli' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" href="css/prettyPhoto.css" media="screen">
  <link rel="stylesheet" href="css/jquery.jqzoom.css" media="screen">
  <link rel="stylesheet" href="css/icons/icons.css" media="screen">  
  <link rel="stylesheet" href="css/custom.css" media="screen">
  <link rel="stylesheet" href="css/grid.css" media="screen">
  <link id="custom-style" rel="stylesheet" href="css/styles/red.css" media="screen">
  <!-- JAVASCRIPT
  ================================================== -->
  <script src="js/jquery-1.7.1.min.js"></script>
  <script src="js/jquery.easing.1.3.js"></script>
  <script src="js/jquery-ui-1.10.3.min.js"></script>
  <script src="js/jquery.flexslider.js"></script>
  <script src="js/idangerous.swiper-1.9.min.js"></script>  
  <script src="js/jquery.sharrre-1.3.4.min.js"></script>  
  <script src="js/kenburns.js"></script>    
  <script src="js/twitter/jquery.tweet.js"></script>  
  <script src="js/jquery.fitvids.min.js"></script>  
  <script src="js/jquery.jqzoom-core-pack.js"></script>  
  <script src="js/jquery.prettyPopin.js"></script>  
  <script src="js/jquery.prettyPhoto.js"></script>  
  <script src="js/jquery.cookies.js"></script>  
  <script src="js/custom.js"></script>
  <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
    <link rel="stylesheet" href="css/font-awesome-ie7.css">
  <![endif]-->  
</head>
<body>
  <script>
  window.fbAsyncInit = function(){
    // init the FB JS SDK
    FB.init({  
      status : false,
      xfbml : true
    });    
  };
  // Load the SDK asynchronously
  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/all.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
  <div id="wrapper">
    <div id="demo-panel">
      <span aria-hidden="true" data-icon="&#xe01c;" class="panle-toggle icomoon"></span>
      <h5>Select a Color</h5>
      <div class="style-preview yellow-box" data-style="yellow"></div>
      <div class="style-preview red-box" data-style="red"></div>
      <div class="style-preview blue-box" data-style="blue"></div>
      <div class="style-preview rose-box" data-style="rose"></div>
      <div class="style-preview green-box" data-style="green"></div>
      <div class="style-preview brown-box" data-style="brown"></div>
      <div class="style-preview deep-blue-box" data-style="deep-blue"></div>
      <div class="style-preview orange-box" data-style="orange"></div>
      <h5>Select a Pattern</h5>
      <p>select section and click on pattern image below</p>
      <select name="pattren-for" id="pattren-for">
        <option value="body">Body Background</option>
        <option value="header">Header Section</option>
        <option value="#top-wrapper">Top header section</option>        
        <option value="#main-container">Main content</option>
        <option value="footer">Footer</option>
      </select>
      <div class="pattern-preview p1"></div>
      <div class="pattern-preview p2"></div>
      <div class="pattern-preview p3"></div>
      <div class="pattern-preview p4"></div>
      <div class="pattern-preview p5"></div>
      <div class="pattern-preview p6"></div>
      <div class="pattern-preview p7"></div>
      <div class="pattern-preview p8"></div>
      <div class="pattern-preview p9"></div>
      <div class="pattern-preview p10"></div>
      <div class="pattern-preview p11"></div>
      <div class="pattern-preview p12"></div>
      <div class="pattern-preview p13"></div>
      <div class="pattern-preview p14"></div>
      <div class="pattern-preview p15"></div>
      <div class="pattern-preview p16"></div>
      <div class="pattern-preview p17"></div>
      <div class="pattern-preview p18"></div>
      <div class="pattern-preview p19"></div>
      <div class="pattern-preview p20"></div>
      <div class="pattern-preview p21"></div>
      <div class="pattern-preview p22"></div>
      <div class="pattern-preview p23"></div>
      <div class="pattern-preview p24"></div>
      <div class="pattern-preview p25"></div>
      <div class="pattern-preview p26"></div>
      <div class="pattern-preview p27"></div>
      <div class="pattern-preview p28"></div>
      <div class="pattern-preview p29"></div>
      <div class="pattern-preview p30"></div>
      <div class="pattern-preview p31"></div>
      <div class="pattern-preview p32"></div>
    </div>
    <span aria-hidden="true" data-icon="&#xe001;" class="slide-toggle icomoon"></span>
    <span aria-hidden="true" data-icon="&#xe010;" class="gotoTop icomoon"></span>    
    <div id="top-wrapper">
      <div class="container_12">
        <div class="top-select-buttons grid_2">
          <div id="language" class="top-icon">
            <form action="#" method="get">              
              <div class="top-select-menu">                
                <div>
                  <a class="active_option" title="english"><img src="images/icons/en-flag.png" alt="english"/></a>
                  <a title="fr"><img src="images/icons/fr-flag.png" alt="french"/></a>
                  <a title="ro"><img src="images/icons/ro-flag.png" alt="romanian"/></a>
                </div>
                <i class="icomoon" aria-hidden="true" data-icon="&#xe00f;"></i>                                
              </div>              
            </form>
          </div><!-- end #language -->
          <div id="currency" class="top-icon">  
            <form action="#" method="get">              
              <div class="top-select-menu">
                <div>
                  <a class="active_option" title="euro">€</a>
                  <a title="pounds">£</a>
                  <a title="dollars">$</a>
                </div>
                <i class="icomoon" aria-hidden="true" data-icon="&#xe00f;"></i>
              </div>              
            </form>
          </div><!-- end #currency -->          
        </div>
        <div class="grid_7 account-links">
          <a href="register.html"><i class="icomoon" aria-hidden="true" data-icon="&#x2617;"></i>Welcme, visitor</a>
          <a href="account.html"><i class="icomoon" aria-hidden="true" data-icon="&#x2191;"></i>My Account</a>
          <a href="wishlist.html"><i class="icomoon" aria-hidden="true" data-icon="&#xe00d;"></i>Wish List</a>
        </div>
        <div class="grid_3 mini-cart clearfix omega">
          <div class="click-trigger">        
          <span class="cart-top"><i class="cart-top-icon icomoon" aria-hidden="true" data-icon="&#x25e0;"></i><i class="icomoon down-arrow" aria-hidden="true" data-icon="&#xe00f;"></i></span>
          <a class="checkout-icon right icomoon" aria-hidden="true" data-icon="&#xe014;" href="checkout.html"></a>
          <div class="cart-data">Shopping Cart<span class="count">(5) Items</span></div>
              <div class="cart-dropdown hidden_box">                
                <div id="cart-list">                                                      
                  <div class="mini-product">
                    <div class="product-meta">
                      <a href="product-fullwidth.html">
                      <img src="images/mini-product.png" alt="placeholder" />
                        Silver Watche <span>2 x $149.99</span>                        
                      </a>
                      <span class="price">$750</span>
                    </div>
                    <div class="action">
                      <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe004;"></a>
                    </div>
                  </div><!-- mini-product -->
                  <div class="mini-product">
                    <div class="product-meta">
                      <a href="product-sidebar.html">
                      <img src="images/mini-product2.png" alt="placeholder" />
                        Yellow Mini Car<span>3 x $19.65</span>                        
                      </a>
                      <span class="price">$750</span>
                    </div>
                    <div class="action">
                      <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe004;"></a>
                    </div>
                  </div><!-- mini-product -->
                  <div class="mini-product">
                    <div class="product-meta">
                      <a href="product-sidebar.html">
                      <img src="images/mini-product3.png" alt="placeholder" />
                        Orange Handbag <span>1 x $80.55</span>                        
                      </a>
                      <span class="price">$750</span>
                    </div>
                    <div class="action">
                    <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe004;"></a>                    
                    </div>
                  </div><!-- mini-product -->                  
                    <table class="mini-cart-total">
                      <tbody><tr>
                        <td class="left"><span>Sub-Total: </span></td>
                        <td class="right"><span>$101.00</span></td>
                      </tr>
                      <tr>
                        <td class="left"><span>Eco Tax (-2.00): </span></td>
                        <td class="right"><span>$2.00</span></td>
                      </tr>
                      <tr>
                        <td class="left"><span>VAT (17.5%): </span></td>
                        <td class="right"><span>$17.68</span></td>
                      </tr>
                      <tr>
                        <td class="left"><span>Total: </span></td>
                        <td class="right"><span class="total">$120.68</span></td>
                      </tr>
                    </tbody>
                  </table>                  
                </div><!-- end .cart-list -->
                <div class="checkout clearfix">
                    <a class="cart left" href="cart.html"><i class="icomoon" aria-hidden="true" data-icon="&#x25e0;"></i>View Cart</a>
                    <a class="check right" href="checkout.html">Checkout<i class="icomoon" aria-hidden="true" data-icon="&#xe014;"></i></a>
                  </div>
              </div>            
          </div>
        </div><!-- end .mini-cart -->
      </div><!-- end .container_12 -->
    </div><!-- end #top-wrapper -->
    <header>      
    <div class="container_12 header-inner relatived">
      <div id="logo" class="grid_3">
        <a href="index.html"><img src="images/logo.png" alt="olympia-logo" /></a>
      </div>    
      <nav class="grid_8 right omega">
        <div class="mobile-menu-trigger"><span class="icomoon mobile-icon-menu" aria-hidden="true">&#xe008;</span><a class="menu-label">Select a Page</a></div>
          <ul class="primary-nav">
            <li><a class="active-page" href="index.html">Home</a></li>
            <li><a href="#">Pages</a>
              <div class="submenu_wrapper column4">
                <ul>                  
                  <li><a href="index.html">Homepage A</a></li>
                  <li><a href="index2.html">Homepage B</a></li>
                  <li><a href="index3.html">Homepage C</a></li>
                  <li><a href="boxed.html">Boxed Layout</a></li>
                  <li><a href="background-slideshow.html">Background Slideshow</a></li>
                  <li><a href="category-grid.html">Category Grid</a></li>
                </ul>
                <ul>
                  <li><a href="category-list.html">Category List</a></li>                 
                  <li><a href="product-fullwidth.html">product detail 1</a></li>
                  <li><a href="product-sidebar.html">product detail 2</a></li>
                  <li><a href="blog-listing.html">Blog Listing</a></li>
                  <li><a href="blog-post.html">Blog Post</a></li>
                  <li><a href="contact.html">Contact Page</a></li>
                </ul>
                <ul>
                  <li><a href="compare.html">Compare</a></li>                  
                  <li><a href="wishlist.html">Wishlist</a></li>
                  <li><a href="cart.html">Shopping Cart</a></li>
                  <li><a href="checkout.html">checkout</a></li>
                  <li><a href="account.html">Account</a></li>
                  <li><a href="login.html">Login</a></li>
                </ul>
                <ul>                  
                  <li><a href="register.html">Register</a></li>
                  <li><a href="left-sidebar.html">Left Sidebar Template</a></li>
                  <li><a href="right-sidebar.html">Right Sidebar Template</a></li>
                  <li><a href="both-sidebars.html">Both Sidebar Template</a></li>
                </ul>                
              </div>
            </li>
            <li><a href="category-grid.html">Men</a>
              <ul>
              <li><a href="#">Sub Category</a>
              <li><a href="#">Sub Category</a>
              <li><a href="#">Sub Category</a>
              <li><a href="#">Sub Category</a>
              <li><a href="#">Sub Category</a>
              </ul>
            </li>            
            <li><a href="#">Women</a></li>            
            <li><a href="#">Megamenu</a>
              <div class="megamenu">
                <div class="grid_7 omega">
                  <h4>Featured Video</h4>
                  <p>
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem, ipsum modi quod ea eligendi pariatur incidunt cumque nihil quas porro! Quos aliquam dolore quae earum itaque! Sint, nobis magni ducimus.
                  </p>                  
                </div>
                <div class="grid_5 omega">                  
                  <object type="application/x-shockwave-flash" id="player24535181_2121416347" name="player24535181_2121416347" data="http://a.vimeocdn.com/p/flash/moogaloop/5.2.55/moogaloop.swf?v=1.0.0" width="720" height="400" style="visibility: visible;"><param name="allowscriptaccess" value="always"><param name="allowfullscreen" value="true"><param name="scalemode" value="noscale"><param name="quality" value="high"><param name="wmode" value="opaque"><param name="bgcolor" value="#000000"><param name="flashvars" value="server=vimeo.com&amp;player_server=player.vimeo.com&amp;cdn_server=a.vimeocdn.com&amp;embed_location=&amp;force_embed=0&amp;force_info=0&amp;moogaloop_type=moogaloop_local&amp;js_api=1&amp;js_getConfig=player24535181_2121416347.getConfig&amp;js_setConfig=player24535181_2121416347.setConfig&amp;clip_id=24535181&amp;fullscreen=1&amp;js_onLoad=player24535181_2121416347.player.moogaloopLoaded&amp;js_onThumbLoaded=player24535181_2121416347.player.moogaloopThumbLoaded"></object>
                </div>
              </div>
            </li>
            <li><a href="blog-listing.html">Blog</a></li>
            <li><a href="contact.html">Contact</a></li>
            <li class="search-wrapper">
              <a href="#" aria-hidden="true" data-icon="&#x2610;" class="search-popup-trigger icomoon"></a>
              <div id="top-search-wrapper">
                <div class="relatived">
                  <form action="http://speed730.net/preview/olympia/get">
                    <input aria-hidden="true" type="submit" value="&#x2610;" id="search" class="search-button icomoon">
                    <input type="text" name="search" placeholder="search..."/>
                  </form>
                </div>
              </div>
            </li> 
          </ul>          
        </nav>
      </div><!-- container_12 -->
    </header>
    <div id="featured" class="f-padding clearfix container_12">
      <div class="banner featured-banner grid_8">
        <span class="star-ribbon star-ribbon-left red-ribbon"></span>
        <a href="#">
          <img src="images/images/banner-f1.jpg" alt="banner">
        </a>
      </div>
    <div class="banner featured-banner banner-side grid_4 omega">
      <span class="custom-ribbon right-ribbon" style="background-image:url('images/custom-ribbon2.png')"></span>
        <span class="cover"></span>        
        <img src="images/images/banner-f2.jpg" alt="banner">
        <a class="icomoon link-icon" aria-hidden="true" data-icon="&#xe000;"></a>
    </div>
    <div class="banner featured-banner banner-side grid_4 omega">
      <span class="custom-ribbon left-ribbon" style="background-image:url('images/custom-ribbon1.png')"></span>
      <span class="cover"></span>
      <img src="images/images/banner-f3.jpg" alt="banner">        
      <a class="icomoon link-icon" aria-hidden="true" data-icon="&#xe000;"></a>      
    </div>    
    </div><!-- end #featured -->      
    <div id="main-container" class="homepage">
      <div class="floatted-box">      
        <div class="offers-box container_12">     
          <span class="blur-cover-left"></span>
          <span class="blur-cover-right"></span>
            <div class="flexslider">
              <ul class="slides">
                <li><div class="tooltip-cover"><div class="tooltip"><span class="title">Orange Handbag</span><div class="price"><span class="old-price">$80.55</span><span class="new-price">$65.55</span></div></div></div><span class="cover"></span><a href="#" class="icomoon heart" aria-hidden="true" data-icon="&#xe00d;"></a><a class="icomoon eye" rel="prettyPopin" aria-hidden="true" data-icon="&#x25c7;" href="quick-view-template1.html"></a><a href="product-fullwidth.html" class="  icomoon plus" aria-hidden="true" data-icon="&#xe01a;"></a><img src="images/images/qview/1.jpg" alt="product-thumb"/></li>
                <li><div class="tooltip-cover"><div class="tooltip"><span class="title">Sliver Watch</span><div class="price"><span class="reguler-price">$149.99</span></div></div></div><span class="cover"></span><a href="#" class="icomoon heart" aria-hidden="true" data-icon="&#xe00d;"></a><a class="icomoon eye" rel="prettyPopin" aria-hidden="true" data-icon="&#x25c7;" href="quick-view-template2.html"></a><a href="product-fullwidth.html" class="icomoon plus" aria-hidden="true" data-icon="&#xe01a;"></a><img src="images/images/qview/2.jpg" alt="product-thumb"/></li>
                <li><div class="tooltip-cover"><div class="tooltip"><span class="title">Yellow Mini Car</span><div class="price"><span class="reguler-price">$19.65</span></div></div></div><span class="cover"></span><a href="#" class="icomoon heart" aria-hidden="true" data-icon="&#xe00d;"></a><a class="icomoon eye" rel="prettyPopin" aria-hidden="true" data-icon="&#x25c7;" href="quick-view-template3.html"></a><a href="product-fullwidth.html" class="icomoon plus" aria-hidden="true" data-icon="&#xe01a;"></a><img src="images/images/qview/3.jpg" alt="product-thumb"/></li>
                <li><div class="tooltip-cover"><div class="tooltip"><span class="title">Red Handbag</span><div class="price"><span class="reguler-price">$80.55</span></div></div></div><span class="cover"></span><a href="#" class="icomoon heart" aria-hidden="true" data-icon="&#xe00d;"></a><a class="icomoon eye" rel="prettyPopin" aria-hidden="true" data-icon="&#x25c7;" href="quick-view-template4.html"></a><a href="product-fullwidth.html" class="icomoon plus" aria-hidden="true" data-icon="&#xe01a;"></a><img src="images/images/qview/4.jpg" alt="product-thumb"/></li>
                <li><div class="tooltip-cover"><div class="tooltip"><span class="title">T-Shirt</span><div class="price"><span class="old-price">$75.75</span><span class="new-price">$50.99</span></div></div></div><span class="cover"></span><a href="#" class="icomoon heart" aria-hidden="true" data-icon="&#xe00d;"></a><a class="icomoon eye" rel="prettyPopin" aria-hidden="true" data-icon="&#x25c7;" href="quick-view-template5.html"></a><a href="product-fullwidth.html" class="icomoon plus" aria-hidden="true" data-icon="&#xe01a;"></a><img src="images/images/qview/5.jpg" alt="product-thumb"/></li>                
                <li><div class="tooltip-cover"><div class="tooltip"><span class="title">Black Hells</span><div class="price"><span class="reguler-price">$24.99</span></div></div></div><span class="cover"></span><a href="#" class="icomoon heart" aria-hidden="true" data-icon="&#xe00d;"></a><a class="icomoon eye" rel="prettyPopin" aria-hidden="true" data-icon="&#x25c7;" href="quick-view-template6.html"></a><a href="product-fullwidth.html" class="icomoon plus" aria-hidden="true" data-icon="&#xe01a;"></a><img src="images/images/qview/6.jpg" alt="product-thumb"/></li>
              </ul>
            </div>        
        </div>      
      </div><!-- end .floatted-box -->
      <div class="container_12 full-container">
        <div class="featured-module module clearfix">
          <div class="box-heading"><h3>Featured</h3></div>
            <div class="slides">
              <div class="product-box grid_3">
              <span class="ribbon-sale"></span>
              <a class="img-cover" href="product-sidebar.html">
                <img src="images/images/watch-grid.jpg" alt="product-image">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img src="images/stars-5.png" alt="5-stars-ratting">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe01c;"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe00d;"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#x25e0;"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3">
              <span class="ribbon-new"></span>
              <a class="img-cover" href="product-sidebar.html">
                <img src="images/images/tshirt-2.jpg" alt="product-image">
              </a>
              <div class="product-meta">
                <div class="title"><a href="product-sidebar.html">Product Name</a></div>
                <img src="images/stars-5.png" alt="5-stars-ratting">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe01c;"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe00d;"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#x25e0;"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3">              
              <a class="img-cover" href="product-sidebar.html">
                <img src="images/images/handbag-s.jpg" alt="product-image">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img src="images/stars-5.png" alt="5-stars-ratting">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe01c;"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe00d;"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#x25e0;"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3">              
              <a class="img-cover" href="product-fullwidth.html">
                <img src="images/images/tshirt-1.jpg" alt="product-image">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img src="images/stars-5.png" alt="5-stars-ratting">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe01c;"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe00d;"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#x25e0;"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3">
              <span class="ribbon-new"></span>
              <span class="ribbon-sale"></span>
              <a class="img-cover" href="#">
                <img src="images/images/handbag-black-grid.jpg" alt="product-image">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img src="images/stars-5.png" alt="5-stars-ratting">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe01c;"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe00d;"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#x25e0;"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3">
              <span class="ribbon-sale"></span>
              <a class="img-cover" href="#">
                <img src="images/images/lego-trucks-grid.jpg" alt="product-image">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img src="images/stars-5.png" alt="5-stars-ratting">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe01c;"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe00d;"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#x25e0;"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3">
              <span class="ribbon-sale"></span>
              <a class="img-cover" href="#">
                <img src="images/images/product-grid.jpg" alt="product-image">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img src="images/stars-5.png" alt="5-stars-ratting">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe01c;"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#xe00d;"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a href="#" class="icomoon" aria-hidden="true" data-icon="&#x25e0;"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
        </div><!-- end .slides -->
      </div><!-- .featured-module -->      
      <hr class="block-separator">
      <a href="http://themeforest.net/item/olympia-responsive-html5-ecommerce/4852725"><img src="images/banner.png" alt="banner"></a>
      <hr class="block-separator">
      <div class="latest-blog clearfix">
        <div class="box-heading"><h3>Latest News</h3>
          <a href="blog-listing.html" class="all-blog right">View All</a>
        </div>
        <article class="grid_4">
          <div class="meta">
            <span class="date"><span class="day">07</span><span class="month">MAY</span></span>
            <div class="title"><h4>News Title</h4><span><a href="#">News</a>,<a href="#">Offers</a>,<a href="#">Bestsellers</a></span></div>
          </div>
          <a class="img-cover prettyphoto" href="images/images/latest-news-a.jpg">
            <i class="icomoon" aria-hidden="true" data-icon="&#xe003;"></i>
            <img src="images/images/latest-news-a.jpg" alt="news-image">
          </a>
          <div class="excerpt">
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et</p>            
          </div>
          <a class="blog-link" href="#"><i class="icomoon" aria-hidden="true" data-icon="&#xe01a;"></i>Read More</a>
        </article>
        <article class="grid_4">
          <div class="meta">
            <span class="date"><span class="day">07</span><span class="month">MAY</span></span>
            <div class="title"><h4>News Title</h4><span><a href="#">News</a>,<a href="#">Offers</a>,<a href="#">Bestsellers</a></span></div>
          </div>
          <a class="img-cover prettyphoto" href="http://vimeo.com/24535181">
            <i class="icomoon" aria-hidden="true" data-icon="&#xe009;"></i>
            <img src="images/images/latest-news-b.jpg" alt="news-image">
          </a>
          <div class="excerpt">
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et</p>            
          </div>
          <a class="blog-link" href="#"><i class="icomoon" aria-hidden="true" data-icon="&#xe01a;"></i>Read More</a>
        </article>
        <article class="grid_4 omega">
          <div class="meta">
            <span class="date"><span class="day">07</span><span class="month">MAY</span></span>
            <div class="title"><h4>News Title</h4><span><a href="#">News</a>,<a href="#">Offers</a>,<a href="#">Bestsellers</a></span></div>
          </div>
          <a class="img-cover" href="#"><img src="images/images/latest-news-c.jpg" alt="news-image"></a>
          <div class="excerpt">
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et</p>            
          </div>
          <a class="blog-link" href="#"><i class="icomoon" aria-hidden="true" data-icon="&#xe01a;"></i>Read More</a>
        </article>
        </div><!-- end .latest-blog -->        
      </div><!-- end .container_12 -->
      <div class="base-info">
        <div class="container_12">
          <div class="info-block grid_4">
            <span class="icomoon" aria-hidden="true" data-icon="&#xe078;"></span>
            <div class="base-info-data">
              <h4>SAFE & SECURE</h4>
              <span>Consectetur adipisicing elit,</span>
            </div>
          </div>
          <div class="info-block grid_4">
            <span class="icomoon" aria-hidden="true" data-icon="&#x25df;"></span>
            <div class="base-info-data">
              <h4>SUPORT 24/7 </h4>
              <span class="phone-number">+213-123-456-7890</span>
            </div>
          </div>
          <div class="info-block grid_4 omega">            
            <span class="icomoon" aria-hidden="true" data-icon="&#xe06a;"></span>
            <div class="base-info-data">
              <h4>FREE SHIPPING</h4>
              <span>adipisicing elit, sed do eiusmod </span>
            </div>
          </div>
        </div>
      </div><!-- end .base-info -->
    </div><!-- end #main-container -->
    <footer>
      <span class="style-border"></span>
      <div class="container_12">
        <div class="grid_4 widget-box">
          <div class="box-heading">
            <h4>About Us</h4>
          </div>
          <p>Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et doloremmagna aliqua. Ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
          <ul class="social-icons">
            <li><a href="#" class="icomoon vimeo-icon" aria-hidden="true" data-icon="&#x25a2;"></a></li>
            <li><a href="#" class="icomoon twitter-icon" aria-hidden="true" data-icon="&#x25a1;"></a></li>
            <li><a href="#" class="icomoon facebook-icon" aria-hidden="true" data-icon="&#x25a0;"></a></li>
            <li><a href="#" class="icomoon google-icon" aria-hidden="true" data-icon="&#x25a4;"></a></li>
            <li><a href="#" class="icomoon pinterset-icon" aria-hidden="true" data-icon="&#x25a6;"></a></li>
          </ul>
          <div class="subscribe">
            <form action="http://speed730.net/preview/olympia/post">
              <input type="text" name="email" value="" placeholder="Enter Your Email Address" />
              <button aria-hidden="true" data-icon="&#x21b4;" name="submit" class="icomoon"></button>
            </form>
          </div>
        </div>
        <div class="grid_4 widget-box">
          <div class="box-heading">
            <h4>Latest Tweets</h4>
          </div>
          <div class="grid_3 widget-box">
            <div id="tweets_wraper"></div>
            <script>
            /*$("#tweets_wraper").tweet({
              avatar_size: 32,
              count: 3,
              modpath : 'php/load_tweets.php', 
              username: 'speed730',
              join_text: "auto",
              loading_text: "searching twitter...",      
              auto_join_text_default: "<b>:</b>",
              auto_join_text_ed: "<b>:</b>",      
              refresh_interval: 60,
              template: "{avatar}<div class='vorbim clearfix'>{time}{text}<i class='icomoon tweets-icon' aria-hidden='true' data-icon='&#x25a1;'></i></div>"
            });*/
            </script>
          </div>
        </div>
        <div class="grid_4 widget-box omega">
          <div class="box-heading">
            <h4>My Facebook Page</h4>
          </div>
          <div id="facebook-page">
            <div class="fb-like-box fb_iframe_widget" profile_id="80655071208" data-border-color="transparent" data-width="220" data-height="240" data-colorscheme="light" data-stream="false" data-header="false" fb-xfbml-state="rendered"></div>
          </div>
        </div>
        <hr>
        <div class="grid_2 widget-box">
          <div class="box-heading">
            <h4>Information</h4>
          </div>
          <ul class="list-links">
            <li><a href="#">About Us</a></li>
            <li><a href="#">Blog</a></li>
            <li><a href="#">Delivery Information</a></li>
            <li><a href="#">Privacy Policy</a></li>
            <li><a href="#">Terms & Conditions</a></li>          
          </ul>
        </div>
        <div class="grid_3 widget-box">
          <div class="box-heading">
            <h4>Costumer Service</h4>
          </div>
          <ul class="list-links">
            <li><a href="#">Contact Us</a></li>
            <li><a href="#">Returns</a></li>
            <li><a href="#">Site Map</a></li>
            <li><a href="#">Privacy Policy</a></li>
            <li><a href="#">Terms & Conditions</a></li>          
          </ul>
        </div>
        <div class="grid_2 widget-box">
          <div class="box-heading">
            <h4>Extras</h4>
          </div>
          <ul class="list-links">
            <li><a href="#">Brands</a></li>
            <li><a href="#">Gift Vouchers</a></li>
            <li><a href="#">Affiliates</a></li>
            <li><a href="#">Specials</a></li>
          </ul>
        </div>
        <div class="grid_2 widget-box">
          <div class="box-heading">
            <h4>My Account</h4>
          </div>
          <ul class="list-links">
            <li><a href="#">My Account</a></li>
            <li><a href="#">Order History</a></li>
            <li><a href="#">Wish List</a></li>
            <li><a href="#">Newsletter</a></li>
          </ul>
        </div>
        <div class="grid_3 widget-box omega">
          <div class="box-heading">
            <h4>Contact</h4>
          </div>
          <ul class="contact-info">
            <li><i class="icomoon" aria-hidden="true" data-icon="&#x25df;"></i><span>123-456-7890</span></li>
            <li><i class="icomoon" aria-hidden="true" data-icon="&#x21b4;"></i><span>sales@yourstore.com</span></li>            <li><i class="icomoon" aria-hidden="true" data-icon="&#xe007;"></i><span>Olympia Store 34 New  City 1234, Design</span></li>
          </ul>
        </div>
        <div class="footer-base">
        <div class="grid_6 copyright">
          <p>OLYMPIA Retail Theme - Made by  <a href="http://speed730.net/">Speed730</a> © 2013</p>
        </div>
        <div class="grid_6 payments omega">
          <ul>
            <li><a href="#"><img src="images/payments/american-express.png" alt="american-express"></a></li>
            <li><a href="#"><img src="images/payments/amex.png" alt="amex"></a></li>
            <li><a href="#"><img src="images/payments/paypal.png" alt="paypal"></a></li>
            <li><a href="#"><img src="images/payments/master-card.png" alt="master-card"></a></li>
            <li><a href="#"><img src="images/payments/visa.png" alt="visa"></a></li>
          </ul>
        </div>
      </div><!--end .footer-base -->
      </div><!-- end .container_12 -->
    </footer>
  </div><!-- end #wrapper This wrapper cover all the website-->  
</body>
</html>